import React, { Component } from 'react'
import store from './store'
import { Provider } from 'react-redux'
import { connect } from 'react-redux'
import { addAction, subAction} from './store/actionCreators'

class Demo extends Component {
  render() {
    return (
      <h1>
        Demo 组件--
        {this.props.num}--
        {this.props.title}
      </h1>
    )
  }
}

let ConnectDemo = connect(
  (state)=>{
    let { title } = state.titleReducer
    let { num } = state.numReducer
    return {
      title,
      num
    }
  },
  (dispatch)=>{
    return {
      add: ()=> {
        dispatch(addAction)
      },
      sub: ()=> {
        dispatch(subAction)
      }
    }
  }
)(Demo)

class App extends Component {
  render() {
    return (
      <div>
        <Provider store={store}>
          <ConnectDemo />
        </Provider>
      </div>
    )
  }
}

export default App